<!DOCTYPE html>
<html>
<head>
    <title> smart audio</title>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Fancy 3D-Button" />
    <meta name="keywords" content="" />
    <meta name="author" content="" />
    <link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
    <link rel="stylesheet" type="text/css" href="http://www.cssmoban.com/statics/css/code-demo.css" />

    <!-- WEB字体调用 -->
    <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700' rel='stylesheet' type='text/css'>

</head>
<style>
    *{
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    span.button {
        position: relative;
        color: rgba(255,255,255,1);
        text-decoration: none;
        background-color: rgba(219,87,5,1);
        font-family: 'Yanone Kaffeesatz';
        font-weight: 700;
        font-size: 3em;
        display: block;
        padding: 4px;
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        border-radius: 8px;
        -webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
        -moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
        box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7);
        margin: 100px auto;
        width: 160px;
        text-align: center;

        -webkit-transition: all .1s ease;
        -moz-transition: all .1s ease;
        -ms-transition: all .1s ease;
        -o-transition: all .1s ease;
        transition: all .1s ease;
    }

    span.button:active {
        -webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
        -moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
        box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9);
        position: relative;
        top: 6px;
    }
    .debug_output{
        height:18rem;
        width: 100%;
        overflow-y: scroll;
    }
</style>
<body>

<!-- +++演示代码区开始+++ -->
<span id="push_me" class="button"> 开始 </span>

<div class="debug_output">
	<span id="log">

	</span>
</div>


<script  charset="utf-8">
    DEBUG = true;
    window.onerror=function(){
        if(DEBUG){
            alert(JSON.stringify(arguments));
        }
    };
    //录音处理
    var audio_name = "_doc/audio/input.amr";
    // H5 plus事件处理
    function plusReady(){
        log.log("plusReady");
    }
    if(window.plus){
        plusReady();
    }else{
        document.addEventListener('plusready', plusReady, false);
    }
    // 开始录音
    var r=null,t=0,ri=null,rt=null;
    function startRecord(){
        log.log("startRecord");
        r = plus.audio.getRecorder();
        if ( r == null ) {
            outLine('录音对象未获取');
            return;
        }
        r.record({filename:audio_name}, function(p){
            outLine('录音完成：'+p);
            plus.io.resolveLocalFileSystemURL(p, function(entry){

            }, function(e){
                outLine('读取录音文件错误：'+e.message);
            });
        }, function(e){
            outLine('录音失败：'+e.message);
        } );
    }
    // 停止录音
    function stopRecord(){
        log.log("stopRecord");
        clearInterval(ri);
        ri = null;
        r.stop();
        w = null;
        r = null;
    }


    function read(text){
        var a = new Audio();
        a.src = "http://ctrl_v1.yangakw.cn/read?msg="+text;
        a.play();
    }

    function upload_audio(user_id) {
        if(!user_id){
            user_id = 123;
        }
        outLine("upload_audio");
        var up_url = "http://ctrl_v1.yangakw.cn/speech";
        var wt = plus.nativeUI.showWaiting();
        var task = plus.uploader.createUpload(up_url, {
                method: "POST"
            },
            function(resp, status) { //上传完成
                wt.close();
                if(status == 200){
                    var resp_text = resp.responseText;
                    outLine(resp_text);
                    var data = JSON.parse(resp_text);
                    successCB(data);
                }else{
                    outLine("status=>"+status+JSON.stringify(resp));
                }
            }
        );
        task.addFile( audio_name, {key:"audio"} );
        task.start();
    }

    function successCB(data){
        var msg = data.msg;
        read(msg);
    }
    //事件处理
    var div = document.getElementById("push_me");
    var log = document.getElementById("log");
    log.log=function(msg){
        var myDate = new Date();
        var date= myDate.toLocaleString();
        if(DEBUG){
            if(typeof msg != "string"){
                msg = JSON.stringify(msg);
            }
            log.innerHTML = date+"<br/>"+msg+"<br/>"+log.innerHTML;
        }
    };
    outLine = log.log;
    function ondown(){
        log.log("ondown");
        startRecord();
    }
    function onup(){
        stopRecord();
        log.log("onup");
        upload_audio();
    }
    div.ontouchstart = ondown;
    div.ontouchend  = onup ;
    div.onmousedown = ondown;
    div.onmouseup  = onup ;
</script>

</body>
</html>
